<template>
  <GridView ref="gridRef" v-if="gridJson" :gridJson="gridJson">
    <!-- 查询列表扩展 -->
    <template #query> </template>
    <!-- 字段列表扩展 -->
    <template #column="scope"></template>
    <!-- 数据处理扩展,存在时替换默认处理逻辑,插入对应字段名称的插槽即可替换默认内容渲染 -->
    <template #字段名称="{ scope, field }"></template>
    <!-- 操作列表扩展 -->
    <template #operate="{ scope }">
      <el-button
          v-if="scope.row.state !== 'CLOSE'"
          style="order: 7"
          :type="scope.row.state === 'PAUSED' ? 'success' : 'warning'"
          size="small"
          :icon="scope.row.state === 'PAUSED' ? 'VideoPlay' : 'VideoPause'"
          @click="change(scope.row)"
      />
    </template>
    <!-- 编辑页面扩展任意属性 -->
    <template #EDIT_ADD_FIELD="{ modal }"> </template>
    <!-- 添加页面扩展任意属性 -->
    <template #ADD_ADD_FIELD="{ modal }"> </template>
  </GridView>
  <el-empty description="网格数据加载中" v-else />
</template>
<script setup>
import GridView from '../grid/json/preview/GridView.vue'
import FaSysScheduledTasks from '@/api/sys/FaSysScheduledTasks'
// 单页面网格模版
import { inject, ref, onBeforeMount } from 'vue'
const api = inject('api')
const props = defineProps(['gridId'])
const gridJson = ref(null)
const gridRef = ref()
onBeforeMount(() => {
  api
      .getApi('FaSysGrid', props.gridId)
      .getCurrentJson()
      .then((data) => {
        gridJson.value = data
      })
})

// 完成任务
function change(row) {
  if (row.state === 'PAUSED') {
    // 恢复任务
    resume(row.jobName)
  } else {
    // 暂停任务
    pause(row.jobName)
  }
}

// 暂停任务
function pause(jobName) {
  new FaSysScheduledTasks()
      .pause(jobName)
      .then((res) => gridRef.value.search())
      .catch((err) => {
        console.err(err)
      })
}

// 恢复任务
function resume(jobName) {
  new FaSysScheduledTasks()
      .resume(jobName)
      .then((res) => gridRef.value.search())
      .catch((err) => {
        console.err(err)
      })
}
</script>
<style scoped></style>
